@include('home\header')
</head>
<body>
@include('home\nav')
<div class="container">
	<ul class="media-list comm" id="comm-list">
		@foreach($comm as $com)
		{!!$com->main_content!!}
		@endforeach
	</ul>
	<ul class="media-list comm">
		<li class="media">
			<div class="media-left">
			</div>
			<div class="modal-body">
				<form action="" id="form-msg">
					<div class="form-group">
						@if(Auth::check())
						{{Auth::user()->name}}
						@endif
						<textarea id="message-text" class="form-control" name="content"></textarea>
						<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary btn-lg btn-block" autocomplete="off">
						  确认留言
						</button>
					</div>
				</form>
			</div>
		</li>
	</ul>

<div id="div"></div>
</div>
<script>
	<!-- js留言实现开始 -->
	crea();
	/*底部留言触发开始*/
	$('#myButton').on('click' , function () {
		@if(Auth::check())
		@else
			document.location.href = "{{url('login')}}";
			return false;
		@endif
		var form = document.getElementById('form-msg');
		$.ajax({
			type: 'POST',
			url: '',
			data: {noreply:{content:form.content.value}},
			dataType: 'json',
			headers: {
			'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
			},
			success: function(data){
				if (data) {
					var div = '<li class="media" id='+data.commentid+'>';
						div += '<div class="media-left"><a href="#">';
						if (data.imghg) {
							div += '<img class="commhgimg media-object" src="'+data.imghg+'" alt="">';
						};
						div += '<img class="img-circle media-object" src="'+data.img+'" alt=""></a>';
						div += '<a class="btn btn-default btn-sm" style="border:0" href="#" data-toggle="tooltip" data-placement="bottom" title="赞本条">赞<span class="badge">0</span></a>';
						div += '</div>'
						div += '<div class="media-body">';
						div += '<div class="media-heading">';
						div += '<a class="label label-default" href="">'+data.nick+'</a><small class="commtime">'+data.creat_at+'</small>';
						div += '<a class="btn btn-primary btn-sm commhf" comm-parent='+data.commentid+' comm-id="parent" comm-name="'+data.nick+'" href="javascript:" data-whatever="@mdo" data-target="#exampleModal" data-toggle="modal">回复</a>';
						div += '</div>';
						div += '<p class="commcontent small">';
						div +=  data.content;
						div += '</p>';
						div += '</div>';
						div += '<div class="clear"></div>';
						div += '</li>';
						$('#comm-list').append(div);
						crea();
					$('#message-text').val('');
				};
			},
			error: function(xhr, type){
				alert('提交失败')
			}
		});

	});
	/*底部留言触发结束*/

	$('#myButton').on('click', function () {
         $(this).button('loading').delay(1000).queue(function(){
         	$(this).button('reset');
         	$(this).dequeue();
         });

    });  
	function crea(){
  	$('[data-toggle="tooltip"]').tooltip()
  	/*点击回复触发开始*/
	$('[data-toggle="modal"]').unbind('click').on('click' , function (e) {
		var div = '<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">';
			div += '<div class="modal-dialog" role="document">';
			div += '<div class="modal-content">';
			div += '<div class="modal-header">';
			div += '<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>';
			div += '<h4 class="modal-title" id="exampleModalLabel">回复留言</h4>';
			div += '</div>';
			div += '<div class="modal-body">';
			div += '<form>';
			div += '<div class="form-group">';
			div += '<label for="message-text" class="control-label">回复'+$(e.target).attr('comm-name')+':</label>';
			div += '<textarea class="form-control" id="comm-text"></textarea>';
			div += '<input type="hidden" name="comm-id" value="'+$(e.target).attr('comm-id')+'">';
			div += '<input type="hidden" name="comm-parent" value="'+$(e.target).attr('comm-parent')+'">';
			div += '</div>';
			div += '</form>';
			div += '</div>';
			div += '<div class="modal-footer">';
			div += '<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>';
			div += '<button type="submit" class="btn btn-primary">确定</button>';
			div += '</div>';
			div += '</div>';
			div += '</div>';
			div += '</div>';
		$('#div').append(div);

		/*模拟窗提交触发开始*/
		$('#exampleModal button[type="submit"]').on('click' , function () { 
			var comm_id = $('[name="comm-parent"]').val();
			var id = $('div[class="media"]').length;
			var parent = $('[name="comm-id"]').val();
			@if(Auth::check())
			@else
				document.location.href = "{{url('login')}}";
				return false;
			@endif
			$.ajax({
				type: 'POST',
				url: '',
				data: {
						reply:{content:$('#comm-text').val()},
						noreply:{commentid:comm_id},
					  },
				dataType: 'json',
				headers: {
				'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
				},
				success: function(data){
					var div = '<div class="media" comm-id='+id+'>';
					div += '<div class="media-left"><a href="#">';
					if (data.imghg) {
						div += '<img class="commhgimg media-object" src="'+data.imghg+'" alt="">';
					};
					div += '<img class="img-circle media-object" src="'+data.img+'" alt=""></a>';
					div += '</div>';
					div += '<div class="media-body">';
					div += '<div class="media-heading">';
					div += '<a class="label label-default" href="">'+data.nick+'</a><small class="commtime">2016/6/16 16:33</small>';
					div += '<a class="btn btn-primary btn-sm commhf" comm-parent='+comm_id+' comm-id='+id+' comm-name="'+data.nick+'" href="" data-whatever="@mdo" data-target="#exampleModal" data-toggle="modal">回复</a>';
					div += '</div>';
					div += '<p class="commcontent small">';
					div += data.content;
					div += '</p>';
					div += '</div>';
					div += '<div class="clear"></div>';
					div += '</div>';
				if (parent == "parent") {
					$('#'+comm_id+' .media-body').eq(0).append(div);
				} else {
					$('div[comm-id="'+parent+'"] .media-body').eq(0).append(div);
				}
				$('#exampleModal').modal('hide');
				crea();
				$.ajax({
				type: 'POST',
				url: '',
				data: {
						html:{commentid:comm_id,main_content:'<li class="media" id="'+comm_id+'">'+document.getElementById(comm_id).innerHTML+'</li>'},
					  },
				dataType: 'json',
				headers: {
				'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
				},
				success: function(data){

				},
				error: function(xhr, type){
				alert('提交失败')
				}
			});

				},
				error: function(xhr, type){
				alert('提交失败')
				}
			});
		})
		/*模拟窗提交触发结束*/
		$('#exampleModal').on('hidden.bs.modal', function (e) {
  	 		$('#div').html('');
		})
	});
	/*点击回复触发结束*/
}
<!-- 结束 -->
</script>
@include('home\footer')